<template>
  <div class="suit">
    <img :src="$upload+user.icon"
         v-if="user.icon">
    <span>
      <p class="nickname">{{user.nickname }}</p>
      <p class="time">{{ TimeToDay(time) }}</p>
    </span>
  </div>
</template>
<script>
export default {
  props: {
    user: {
      type: Object
    },
    time: {
      type: String
    }
  },
  computed: {
    TimeToDay () {
      function formatDateTime (inputTime) {
        const date = new Date(inputTime)
        const y = date.getFullYear()
        let m = date.getMonth() + 1
        m = m < 10 ? ('0' + m) : m
        let d = date.getDate()
        d = d < 10 ? ('0' + d) : d
        return y + '-' + m + '-' + d
      }
      return time => {
        const now = new Date().getTime()
        const pastTime = now - time
        if (pastTime < 60000) {
          return '刚刚'
        } else if (pastTime > 60000 && pastTime < 3600000) {
          // 一小时内
          return `${Math.floor(pastTime / 60000)}分钟前`
        } else if (pastTime > 3600000 && pastTime < 86400000) {
          // 一天内
          return `${Math.floor(pastTime / 3600000)}小时前`
        } else if (pastTime > 86400000 && pastTime < 604800000) {
          // 一周内
          return `${Math.floor(pastTime / 86400000)}天前`
        } else {
          return `${formatDateTime(parseInt(time))}`
        }
      }
    }
  }
}
</script>
<style lang="less" scoped>
.suit {
  display: flex;
  align-items: center;
  img {
    border-radius: 50%;
    width: 35px;
    height: 35px;
  }
  span {
    margin-left: 8px;
    .nickname {
      font-size: 16px;
    }
    .time {
      font-size: 12px;
      color: #a2a6a8;
    }
  }
}
</style>
